import { Component, OnInit, TemplateRef, ViewChild } from '@angular/core';
import { ColumnType, SPage, TablePageComponent } from '@shared/components/table-page/table-page.component';
import { RoleComponent } from '../role-modal/role.component';
import { _HttpClient } from '@delon/theme';
import { NzMessageService, NzModalService } from 'ng-zorro-antd';
import { ApiService } from '@core/services/api';
import { ACLService } from '@delon/acl';

@Component({
  selector: 'app-role-list',
  templateUrl: './role-list.component.html',
  styleUrls: ['./index.less']
})
export class RoleListComponent implements OnInit {
  @ViewChild('st', {static: false})st: TablePageComponent;
  loading = false;
  addFlag:boolean = this.aclService.canAbility("role-manage/add");//检查用户按钮权限
  editFlag:boolean =  this.aclService.canAbility("role-manage/edit");
  delFlag:boolean =  this.aclService.canAbility("role-manage/delete");
  paramsObj = {
    jsbh: '',
    jsmc: '',
    cdqx: []
  };
  // 已选择的数据
  selectedData:any[];
  config: SPage = {
    columns: [
      {
        index: 'id',
        title: '多选',
        type: ColumnType.checkbox,
      },
      {
        index: 'roleSortno',
        title: '角色编号',
        filter: {
          type: 'string',
          hideSearch: true
        }
      },
      {
        index: 'roleName',
        title: '角色名称',
        filter: {
          placeholder: '请输入角色名称',
          type: 'string'
        }
      },

      {
        index: 'status',
        title: '数据状态',
        type: ColumnType.tag,
        tag: {
          false: {text:'停用', color: 'red'},
          true: {text:'启用', color: 'green'},
        },
        filter: {
          placeholder: '请选择数据状态',
          type: 'select',
          items: [
            {label: '启用', value: true},
            {label: '停用', value: false},
          ]
        }
      },
      /*{
        index: 'createTime',
        title: '添加时间',
        filter: {
          placeholder: 'YYYY-MM-dd',
          type: 'date',
          mode: 'day'
        }
      },*/
      {
        index: 'remark',
        title: '备注'
      }
    ],
    showCheckBox: true,
    reqUrl: this.api.role.page.url,
    editBtn: [
      { title: '编辑', iif: () => this.editFlag }
    ]
  }

  constructor(private http: _HttpClient, private modal: NzModalService, private message: NzMessageService, private api: ApiService,private aclService: ACLService,) { }

  ngOnInit() {
  }
  // 编辑功能开始
  editDic(type: 0 | 1 = 0, _param?: object): void {
    this.modal.create({
      nzTitle: type === 0 ? '新增角色'  : '修改角色',
      nzContent: RoleComponent,
      nzWidth: 800,
      nzComponentParams: {
        type,
        _param
      },
      nzOnOk:()=>{
        this.st.reload();
      },
      nzFooter: null
    })
  }
  operate(e: any): void {
    if (e.title === '编辑') {
      this.editDic(1, e.data);
    }
  }
  _console(e: any): void {
    this.selectedData = e;
  }
  // 编辑功能结束
  // 新增功能
  addData(tpl: TemplateRef<{}>) {
    this.modal.create({
      nzTitle: '新增角色',
      nzContent: tpl,
      nzOnOk: () => {
        console.log(this.paramsObj);
        this.loading = true;
        // this.http.post('/', { description: this.paramsObj }).subscribe((res) => {
        //   console.log(res);
        // });
      },
    });
  }
  // 删除功能
  delData() {
    if(!!this.selectedData && this.selectedData.length !== 0){
      this.modal.confirm({
        nzTitle: '您确定要删除这些数据吗',
        nzOnOk: () => {
          const body = [];
          this.selectedData.forEach(item => {
            body.push({id: item.id})
          })
          this.http.put(this.api.role.delete.url,body).subscribe(res => {
            if (res.status === '200') {
              this.message.success('删除成功');
              this.st.reload();
            }
          })
        }
      })
    }else {
      this.message.warning('请选择数据');
    }
  }
  // 菜单部门件变更回调函数
  onChange($event: string[]): void {
    this.paramsObj.cdqx = $event;
  }
}
